<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../lib/vue.js" type="text/javascript" charset="utf-8"></script>
	</head>
	
	<body>
		<div id="app">
			<input type="button"  value="获取元素" @click="getElement" ref="btn"/>
			<h3 id="myh3" ref="myh3">哈哈哈，今天天气真好</h3>
			<login ref="mylogin"></login>
		</div>
		<script type="text/javascript">
			var login = {
				template:'<h1>登录组件</h1>',
				data(){
					return {
						msg:'son msg'
					}
				},
				methods:{
					show(){
						console.log('son function')
					}
				}
			}
			var vm =new Vue({
				el:'#app',
				data:{},
				methods:{
					getElement(){
						//console.log(document.getElementById('myh3').innerText);
						//ref是reference引用
						/* 通过ref可以拿到组件的引用 */
						console.log(this.$refs.mylogin.msg);
					}
				},
				components:{
					login
				}
			})
		</script>
	</body>
</html>
